{extend name="/index/base" /}

{block name="content"}
<div class="layui-card">
    <div class="layui-card-header layuiadmin-card-header-auto">
        <h2>添加文章</h2>
    </div>
    <div class="layui-card-body">
        <form class="layui-form" action="" method="post">
            <div class="layui-form-item">
                <label for="" class="layui-form-label">父级</label>
                <div class="layui-input-block" style="position: relative;z-index: 10000;">
                    <select name="parent_id" id="parent_id" lay-search>
                        <option value="0">顶级分类</option>
                        {foreach $parents as $k => $v}
                            <option value="{$v['id']}">{$v['name']}</option>
                            {foreach $v['sub'] as $k1 => $v1}
                                 <option value="{$v1['id']}">______{$v1['name']}</option>
                                {foreach $v1['sub'] as $k2 => $v2}
                                <option value="{$v2['id']}">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;______{$v2['name']}</option>
                                {/foreach}
                            {/foreach}
                        {/foreach}
                    </select>
                </div>
            </div>

            <div class="layui-form-item">
                <label for="" class="layui-form-label">名称</label>
                <div class="layui-input-block">
                    <input type="text" name="name" value="{$data['name']??''}" lay-verify="required" class="layui-input name" placeholder="">
                </div>
            </div>

            <div class="layui-form-item">
                <label for="" class="layui-form-label">标签</label>
                <div class="layui-input-block">
                    <input type="checkbox" value="" lay-filter="allCheck"  name="publishPlatform[]" title="全选" >
                    {foreach $tags as $v}
                    <input type="checkbox" value="{$v['id']}" class="tag"  name="publishPlatform[]" title="{$v['name']}" >
                    {/foreach}
                </div>
            </div>

            <div class="layui-form-item">
                <label for="" class="layui-form-label">排序</label>
                <div class="layui-input-block">
                    <input class="layui-input sort" type="text" name="sort" value="{$data['sort']??''}" placeholder="如：1" >
                </div>
            </div>
            <div class="layui-form-item">
                <label for="" class="layui-form-label">来源</label>
                <div class="layui-input-block">
                    <input class="layui-input source" type="text" name="source" value="{$data['source']??''}" placeholder="" >
                </div>
            </div>

            <div class="layui-form-item" >
                <label for="" class="layui-form-label">作者</label>
                <div class="layui-input-block" style="z-index: 999;">
                    <select name="author" id="author" lay-search >
                        <option value="">顶级分类</option>
                        <option value="admin">admin</option>
                        <option value="代驾软件开发">代驾软件开发</option>
                        <option value="开代驾公司">开代驾公司</option>
                        <option value="代驾公司注册顾问">代驾公司注册顾问</option>
                    </select>
                </div>
            </div>
            <div class="layui-form-item">
                <label for="" class="layui-form-label">关键字</label>
                <div class="layui-input-block">
                    <input class="layui-input keywords" type="text" name="keywords" value="{$data['keywords']??''}" placeholder="关键字" >
                </div>
            </div>
            <div class="layui-form-item">
                <label for="" class="layui-form-label">缩略图</label>
                <div class="layui-input-block">
                    <div class="layui-upload">
                        <button type="button" class="layui-btn" id="uploadPic"><i class="layui-icon">&#xe67c;</i>图片上传</button>
                        <div class="layui-upload-list" >
                            <ul id="layui-upload-box" class="layui-clear">
                                {if isset($data['cover'])}
                                <li><img src="" width="300" /><p>上传成功</p></li>
                                {/if}
                            </ul>
                            <input type="hidden" name="cover" id="cover" value="">
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <label for="" class="layui-form-label">描述</label>
                <div class="layui-input-block">
                    <textarea name="desc" placeholder="请输入描述" class="layui-textarea desc">{$data['desc']??''}</textarea>
                </div>
            </div>

            <div class="layui-form-item">
                <label for="" class="layui-form-label">seo_title</label>
                <div class="layui-input-block">
                    <input class="layui-input seo_title" type="text" name="seo_title" value="{$data['seo_title']??''}" placeholder="" >
                </div>
            </div>
            <div class="layui-form-item">
                <label for="" class="layui-form-label">seo关键字</label>
                <div class="layui-input-block">
                    <input class="layui-input seo_keywords" type="text" name="seo_keywords" value="{$data['seo_keywords']??''}" placeholder="" >
                </div>
            </div>

            <div class="layui-form-item">
                <label for="" class="layui-form-label">seo描述</label>
                <div class="layui-input-block">
                    <textarea name="seo_desc" placeholder="" class="layui-textarea seo_desc">{$data['seo_desc']??''}</textarea>
                </div>
            </div>

            <div class="layui-form-item">
                <label for="" class="layui-form-label">内容</label>
                <div class="layui-input-block">
                <script id="container" name="content" type="text/plain"></script>
                </div>
            </div>

            <div class="layui-form-item">
                <div class="layui-input-block">
                    <span type="submit" id="submit" class="layui-btn" lay-submit="" lay-filter="formDemo">确 认</span>
                    <a  class="layui-btn" href="{:URL('admin/article/index')}" >返 回</a>
                </div>
            </div>

        </form>
    </div>
</div>

{/block}


{block name="script"}
<script type="text/javascript" src="__PUBLIC__/static/ueditor/ueditor.config.js"></script>
<!-- 编辑器源码文件 -->
<script type="text/javascript" src="__PUBLIC__/static/ueditor/ueditor.all.js"></script>
<!-- 实例化编辑器 -->
<script type="text/javascript">
    var editor = UE.getEditor('container');
</script>

<script>
    function checkSort(val, max){
        var regex = /^\d+$/;
        if(regex.test(val)){
            if(val > max || val <1){
                layer.msg("请输入1-124之间的数字！")
                return false;
            }
        }else{
            layer.msg("请输入1-124之间的数字！");
            return false;
        }
    }
    layui.use(['layer','table','form','upload'],function () {
        var layer = layui.layer;
        var form = layui.form;
        var table = layui.table;
        var $ = layui.$ //由于layer弹层依赖jQuery，所以可以直接得到
        var upload = layui.upload

        form.on("checkbox(allCheck)", function(data){
            if (data.elem.checked) {
                $(".tag").each(function () {
                    $(this).prop('checked', true);
                });
            } else {
                $(".tag").each(function () {
                    $(this).prop('checked', false);
                });
            }
            form.render("checkbox");


        });

        //普通图片上传
        var uploadInst = upload.render({
            elem: '#uploadPic'
            ,url: '{:URL("admin/article/uploads")}'
            ,multiple: false
            ,before: function(obj){
                obj.preview(function(index, file, result){
                    $('#layui-upload-box').html('<li><img src="'+result+'" width="300" /><p>上传中</p></li>')
                });
            }
            ,done: function(res){
                //如果上传失败
                if(res.code == 0){
                    $("#cover").val(res.url);
                    $('#layui-upload-box li p').text('上传成功');
                    return layer.msg(res.msg);
                }
                return layer.msg(res.msg);
            }
        });

        //提交
        form.on('submit(formDemo)', function(data2) {
            var name = $(".name").val()
            var sort = $(".sort").val();
            var desc = $(".desc").val();
            var keywords = $(".keywords").val();
            var parent_id = $("#parent_id").val();
            var cover = $("#cover").val();
            var content = editor.getContent();

            var seo_title = $(".seo_title").val();
            var seo_keywords = $(".seo_keywords").val();
            var seo_desc = $(".seo_desc").val();

            var tags = [];
            $('input[type=checkbox]:checked').each(function() {
                tags.push($(this).val());
            });
            checkSort(sort, 124);
            var data = {'name':name,'sort':sort,'category_id':parent_id,'cover':cover,'content':content,'tags':tags,"keywords":keywords,"desc":desc,'seo_desc':seo_desc,'seo_keywords':seo_keywords,'seo_title':seo_title};

            $.ajax({
                type: 'POST',
                url: '{:url("admin/article/store")}',
                data: data,
                success: function (ret) {
                    if (ret.code == 200) {
                        layer.msg(ret.msg, {icon: 6, time: 1000}, function () {
                            window.location.href='{:url("admin/article/index")}';
                        });
                    }else{
                        layer.msg(ret.msg);
                    }
                    return false;
                }
            });
        })

        $(".sort").blur(function(){
            checkSort($(this).val(), 124);
        });
    })
</script>

{/block}
